import React from 'react'
import './index.scss'
import { Card, Flex, App } from 'antd'
import jiaoyi from '@/assets/images/search/jiaoyi@2x.png'
import yonghu from '@/assets/images/search/yonghu@2x.png'
import sifa from '@/assets/images/search/sifa@2x.png'
import jingying from '@/assets/images/search/jingying@2x.png'
import heimingdan from '@/assets/images/search/heimingdan@2x.png'
import kongzhuan from '@/assets/images/search/kongzhuan@2x.png'
import xunhuan from '@/assets/images/search/xunhuan@2x.png'
import tiwai from '@/assets/images/search/tiwai@2x.png'
import tongmingcheng from '@/assets/images/search/tongmingcheng@2x.png'
import SearchBar from '@/components/SearchBar'
import { useNavigate } from 'react-router-dom'

const functions = [
  {
    icon: jiaoyi,
    name: '交易对手'
  },
  {
    icon: yonghu,
    name: '用户单位'
  },
  {
    icon: sifa,
    name: '司法风险'
  },
  {
    icon: jingying,
    name: '经营风险'
  },
  {
    icon: heimingdan,
    name: '黑名单'
  },
  {
    icon: kongzhuan,
    name: '空转走单'
  },
  {
    icon: xunhuan,
    name: '循环贸易'
  },
  {
    icon: tiwai,
    name: '体外循环'
  },
  {
    icon: tongmingcheng,
    name: '同名称交易'
  }
]
export default function Search() {
  const naviagte = useNavigate()
  const { message } = App.useApp()
  const onFinish = (values) => {
    if (values.name) {
      naviagte('/searchResult', {
        state: {
          searchInput: values.name,
          searchType: values.type,
          route: '企业画像/搜索/搜索结果'
        }
      })
    } else {
      message.open({
        type: 'error',
        content: '请输入要搜索的企业名称'
      })
    }
  }
  return (
    <div className='home-container'>
      <h2>企业信息轻松查</h2>
      <SearchBar onFinish={onFinish} shape="round"></SearchBar>
      {/*<Card style={{*/}
      {/*  width: '100%',*/}
      {/*  marginTop: 45*/}
      {/*}} title="常用功能" bordered={false}>*/}
      {/*  <Flex wrap gap={16} style={{*/}
      {/*    width: '100%'*/}
      {/*  }}>*/}
      {/*    {functions.map(item => <div className='fun' key={item.name}>*/}
      {/*      <img src={item.icon} alt="" />*/}
      {/*      <p>{item.name}</p>*/}
      {/*    </div>)}*/}
      {/*  </Flex>*/}
      {/*</Card>*/}
    </div>
  )
}
